<!--
 * @Description: 人力资源，学生信息
 * @Author: zhailei
 * @Date: 2021-06-02 13:38:08
 * @LastEditTime: 2021-09-15 10:43:08
 * 
 * @FilePath: \vite-demoe:\wwwroot\Vue\\-cloud-vue\src\components\TopVUI\custom\studentPopup.vue
-->
<template>
  <t-modal
    title="学生信息"
    :width="800"
    :visible="visible"
    switchFullscreen
    wrapClassName="t-popup-modal"
    @ok="handleSubmit"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <div class="toolbar flex justify-between flex-wrap" style="width: 100%;">
      <div class="table-page-search-wrapper">
        <a-form layout="inline">
          <div class="table-operator flex justify-between flex-wrap">
            <a-form-item label="" style="width: 120px;">
              <a-input
                v-model="queryParam.userNo"
                :max-length="11"
                placeholder="学号"
              />
            </a-form-item>
            <a-form-item label="" style="width: 120px;">
              <a-input
                v-model="queryParam.userName"
                :max-length="11"
                placeholder="姓名"
              />
            </a-form-item>
            <div class="table-page-search-submitButtons flex">
              <a-button
                class="cu-btn-primary"
                type="primary"
                @click="$refs.table.refresh(true)"
                >查询</a-button
              >
              <a-button
                class="cu-btn-filter"
                @click="() => (queryParam = { pageSize: 10 })"
                >重置</a-button
              >
            </div>
          </div>
        </a-form>
      </div>
    </div>
    <s-table
      ref="table"
      size="small"
      :columns="columns"
      :data="loadData"
      :rowSelection="rowSelection"
      rowKey="uuid"
      showPagination="auto"
      @rowClick="rowClick"
    >
      <span slot="serial" slot-scope="text, record, index">
        {{ index + 1 }}
      </span>
      <span slot="sex" slot-scope="text">
        {{ text | sexFilter }}
      </span>
    </s-table>
  </t-modal>
</template>

<script>
import moment from "moment";
import { STable, Ellipsis } from "@/components";

const columns = [
  {
    title: "#",
    align: "center",
    width: 50,
    scopedSlots: {
      customRender: "serial",
    },
  },
  {
    title: "学号",
    dataIndex: "userNo",
    sorter: true,
  },
  {
    title: "姓名",
    dataIndex: "userName",
    sorter: true,
  },
  {
    title: "性别",
    dataIndex: "sex",
    scopedSlots: {
      customRender: "sex",
    },
    sorter: true,
  },
  {
    title: "班级",
    dataIndex: "gradeUuid",
    sorter: true,
  },
  {
    title: "备注",
    dataIndex: "remark",
    sorter: true,
  },
];
export default {
  name: "studentPopup",
  components: {
    STable,
    Ellipsis,
  },
  props: {
    visible: {
      type: Boolean,
    },
    gradeUuid: {
      type: Object,
    },
  },
  data() {
    this.columns = columns;
    return {
      confirmLoading: false,
      mdl: null,
      advanced: false,
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        if (this.gradeUuid) {
          this.queryParam.gradeUuid = this.gradeUuid.gradeUuid;
          this.queryParam.orgId = this.gradeUuid.orgId;
          this.queryParam.pageSize = 10;
        }
        const requestParameters = Object.assign({}, parameter, this.queryParam);
        return this.$post("/hr/hrStudent/getPageSet", requestParameters).then(
          (res) => {
            return res;
          }
        );
      },
      selectedRowKeys: [],
      selectedRows: [],
      uuid: "",
      uuids: "",
      nationList: [],
      accountList: [],
    };
  },
  computed: {
    rowSelection() {
      return {
        type: "radio",
        selectedRowKeys: this.selectedRowKeys,
        onChange: this.onSelectChange,
      };
    },
  },
  watch: {
    visible(n, o) {
      if (this.$refs.table) this.$refs.table.refresh(true);
    },
  },
  filters: {
    sexFilter(sex) {
      const sexMap = {
        1: "男",
        2: "女",
      };
      return sexMap[sex];
    },
  },
  created() {},
  methods: {
    closeAdd() {
      // this.selectedRows = []
      // this.selectedRowKeys = []
    },
    rowClick(record, row) {
      // 数据表格行点击事件
      this.selectedRows = [];
      this.selectedRows.push(record);
      this.selectedRowKeys = row;
    },
    handleSubmit() {
      if (!this.selectedRows || this.selectedRows.length == 0) {
        this.$message.warning("请选择一条记录");
        return false;
      }
      let showText = this.selectedRows[0].userName;
      let res = this.selectedRows[0];
      this.$emit("change", showText, res);
      this.close();
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectedRows = selectedRows;
    },
    close() {
      this.$emit("close");
    },
    handleCancel() {
      this.close();
    },
  },
};
</script>

<style lang="less"></style>
